<template>
  <div class="card row p10">
    <div class="col" style="align-items: flex-end;">
      <label class="title">清洗设置</label>
      <div class="row_center mt">
        <label>放水策略</label>
        <el-select class="ml" v-model="ctx.water" style="width: 120px;">
          <el-option :label="TANK1" :value="TANK1" />
          <el-option :label="TANK2" :value="TANK2" />
          <el-option :label="TANK1_2" :value="TANK1_2" />
          <el-option :label="AUTO" :value="AUTO" />
        </el-select>
      </div>
      <div class="row_center mt">
        <label>蒸汽策略</label>
        <el-select class="ml" v-model="ctx.steam" style="width: 120px;">
          <el-option :label="TANK1" :value="TANK1" />
          <el-option :label="TANK2" :value="TANK2" />
          <el-option :label="TANK1_2" :value="TANK1_2" />
          <el-option :label="AUTO" :value="AUTO" />
        </el-select>
      </div>
      <div class="row_center mt">
        <label>c</label>
        <el-input class="ml" v-model="ctx.c" style="width: 120px;" />
      </div>
      <div class="row_center mt">
        <label>放水体积</label>
        <el-input class="ml" v-model="ctx.water_volume" style="width: 120px;" />
      </div>
      <div class="row_center mt">
        <label>d</label>
        <el-input class="ml" v-model="ctx.d" style="width: 120px;" />
      </div>
      <div class="row_center mt">
        <label>蒸汽时间</label>
        <el-input class="ml" v-model="ctx.steam_time" style="width: 120px;" />
      </div>
      <div class="row_center mt">
        <label>清洗间隔</label>
        <el-input class="ml" v-model="ctx.clean_interval" style="width: 120px;" />
      </div>
      <div class="row_center mt" style="align-self: center;">
        <el-button @click="onClickSaveClean" type="warning">保存</el-button>
        <el-button @click="onClickGetClean" type="primary">查询</el-button>
      </div>
    </div>
    <div class="col ml">
      <label class="title">煮面</label>
      <div class="row_center mt">
        <label>列:</label>
        <el-input v-model="ctx.col" style="width: 60px;"/>
        <label class="ml">行:</label>
        <el-input v-model="ctx.row" style="width: 60px;"/>
      </div>
      <div class="row_center mt">
        <label>k</label>
        <el-input v-model="ctx.k" style="width: 60px;" />
        <label class="ml">pre_water</label>
        <el-input v-model="ctx.pre_water" style="width: 60px;" />
      </div>
      <div class="row_center mt">
        <label>f</label>
        <el-input v-model="ctx.f" style="width: 60px;" />
        <label class="ml">g</label>
        <el-input v-model="ctx.g" style="width: 60px;" />
        <label class="ml">defroze</label>
        <el-input v-model="ctx.defroze" style="width: 60px;" />
      </div>
      <div class="row_center mt">
        <label>e</label>
        <el-input v-model="ctx.e" style="width: 60px;" />
        <label class="ml">pour_water</label>
        <el-input v-model="ctx.pour_water" style="width: 60px;" />
      </div>
      <div class="row_center mt">
        <label>h</label>
        <el-input v-model="ctx.h" style="width: 60px;" />
        <label class="ml">mix_soup</label>
        <el-input v-model="ctx.mix_soup" style="width: 60px;" />
      </div>
      <div class="row_center mt">
        <label>i</label>
        <el-input v-model="ctx.i" style="width: 60px;" />
        <label class="ml">clogging</label>
        <el-input v-model="ctx.clogging" style="width: 60px;" />
      </div>
      <div class="row_center mt">
        <label>清洗策略</label>
        <el-select class="ml" v-model="ctx.clean_proxy" style="width: 120px;">
          <el-option :label="IGNORE" :value="IGNORE" />
          <el-option :label="BEFORE" :value="BEFORE" />
          <el-option :label="AFTER" :value="AFTER" />
          <el-option :label="ALL" :value="ALL" />
        </el-select>
      </div>
      <div class="row_center mt">
        <el-button @click="onClickCooking" type="warning">煮面</el-button>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">

import { reactive } from 'vue';
import { IdleCleanInfo, cooking, set_idle_clean_arg, get_idle_clean_arg } from '../../service/main_cmd';
import { CookingOption, TankOption } from '../../service/heat_cmd';
import { dialog } from '../../service/ui';
import { delay } from '../../service/utils';
import { logInfo } from '../../service/notify';

const IGNORE = "不清洗";
const BEFORE = "著面前清洗";
const AFTER = "煮面后清洗";
const ALL = "全清洗";

const TANK1 = "热水罐1";
const TANK2 = "热水罐2";
const TANK1_2 = "热水罐1和2";
const AUTO = "自动";

interface Ctx {
  col: string,
  row: string,

  clean_interval: string,
  clean_proxy: string,

  water: string,
  steam: string,
  c: string,
  water_volume: string,
  d: string,
  steam_time: string,

  k: string,
  pre_water: string,

  f: string,
  g: string,
  defroze: string,

  e: string,
  pour_water: string,

  h: string,
  mix_soup: string,

  i: string,
  clogging: string,
}

const ctx = reactive<Ctx>({
  col: '1',
  row: '1',

  clean_interval: '30',
  clean_proxy: ALL,

  water: AUTO,
  steam: AUTO,
  c: "190",
  water_volume: "50",
  d: "200",
  steam_time: "5",

  k: '125',
  pre_water: '50',

  f: '120',
  g: '135',
  defroze: '20',

  e: '130',
  pour_water: '150',

  h: '125',
  mix_soup: '20',

  i: '115',
  clogging: '5',
});

function parse_tank(): TankOption {
  let water = 1;
  let steam = 1;
  if (ctx.water == TANK2) {
    water = 2;
  } else if (ctx.water == TANK1_2) {
    water = 3;
  } else if (ctx.water == AUTO) {
    water = 4;
  }

  if (ctx.steam == TANK2) {
    steam = 2;
  } else if (ctx.steam == TANK1_2) {
    steam = 3;
  } else if (ctx.steam == AUTO) {
    steam = 4;
  }

  return {
    water: water,
    steam: steam,
  }
}

function parse_clean(): IdleCleanInfo {
  return {
    clean_interval: parseInt(ctx.clean_interval),
    tank: parse_tank(),
    clean: {
      c: parseInt(ctx.c),
      water: parseInt(ctx.water_volume),
      d: parseInt(ctx.d),
      steam: parseInt(ctx.steam_time)
    }
  }
}

function parse_cooking_option(): CookingOption {
  return {
    k: parseInt(ctx.k),
    pre_water: parseInt(ctx.pre_water),
    f: parseInt(ctx.f),
    g: parseInt(ctx.g),
    defroze: parseInt(ctx.defroze),
    e: parseInt(ctx.e),
    pour_water: parseInt(ctx.pour_water),
    h: parseInt(ctx.h),
    mix_soup: parseInt(ctx.mix_soup),
    i: parseInt(ctx.i),
    clogging: parseInt(ctx.clogging)
  }
}

function parse_clean_proxy(): number {
  let v = 0;
  if (ctx.clean_proxy == BEFORE) {
    v = 1;
  } else if (ctx.clean_proxy == AFTER) {
    v = 2;
  } else if (ctx.clean_proxy == ALL) {
    v = 3;
  }
  return v;
}

async function onClickCooking() {

  try {
    logInfo.action = [];

    const col = parseInt(ctx.col);
    const row = parseInt(ctx.row);
    const clean_proxy = parse_clean_proxy();
    const tank = parse_tank();
    const clean = parse_clean();
    const cooking_option = parse_cooking_option();
    await cooking(col, row, clean_proxy, tank, clean.clean, cooking_option);
    dialog.succ('煮面完成');
  } catch (msg) {
    dialog.err(msg);
  }
}

async function onClickSaveClean() {

  try {
    const clean = parse_clean();
    await set_idle_clean_arg(clean.clean_interval, clean.tank, clean.clean);
    dialog.succ('保存成功');
  } catch (msg) {
    dialog.err(msg);
  }
}

async function onClickGetClean() {

  try {
    const info = await get_idle_clean_arg();
    ctx.c = '';
    ctx.water_volume = '';
    ctx.d = '';
    ctx.steam_time = '';
    ctx.clean_interval = '';
    await delay(50);
    ctx.c = `${info.clean.c}`;
    ctx.water_volume = `${info.clean.water}`;
    ctx.d = `${info.clean.d}`;
    ctx.steam_time = `${info.clean.steam}`;
    ctx.clean_interval = `${info.clean_interval}`;
    switch (info.tank.water) {
      case 1: ctx.water = TANK1; break;
      case 2: ctx.water = TANK2; break;
      case 3: ctx.water = TANK1_2; break;
      case 4: ctx.water = AUTO; break;
    }
    switch (info.tank.steam) {
      case 1: ctx.steam = TANK1; break;
      case 2: ctx.steam = TANK2; break;
      case 3: ctx.steam = TANK1_2; break;
      case 4: ctx.steam = AUTO; break;
    }
    dialog.succ('查询成功');
  } catch (msg) {
    dialog.err(msg);
  }
}

</script>
